<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="/plug/layui/css/layui.css" rel="stylesheet">
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }

        body {
            padding: 16px;
        }
    </style>
</head>
<body>
<form class="layui-form layui-form-pane" action="">
    <div class="layui-form-item">
        <label class="layui-form-label">学生学号</label>
        <div class="layui-input-block">
            <input type="text" name="no" placeholder="请输入学生学号" class="layui-input" value="{$data.account_no}" disabled required>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">学生姓名</label>
        <div class="layui-input-block">
            <input type="text" name="name" placeholder="请输入学生姓名" class="layui-input" value="{$data.account_name}"
                   required>
        </div>
    </div>
    <div class="layui-form-item" pane="">
        <label class="layui-form-label">学生性别</label>
        <div class="layui-input-block">
            {if $data.account_gender == 1}
            <input type="radio" name="sex" value="1" title="男" checked="">
            <input type="radio" name="sex" value="2" title="女">
            {else}
            <input type="radio" name="sex" value="1" title="男">
            <input type="radio" name="sex" value="2" title="女" checked="">
            {/if}
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn layui-btn-primary" lay-submit="" lay-filter="submit">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
<script src="/plug/layui/layui.js"></script>
<script>
    // LayUI的标准写法，调用 from组件
    layui.use("form", function () {
        //拦截表单提交，拦截了lay-filter的值为submit123的按钮的点击事件
        layui.form.on("submit(submit)", function (data) {
            //调用jquery框架的ajax组件
            layui.jquery.ajax({
                //接口地址
                url: "/api/account/edit?id={$data.account_id}&name=" +
                    data.field.name + "&gender=" + data.field.sex,
                //提交方式
                type: "GET",
                //成功回调
                success: function (data) {
                    if (data === "1") {
                        //代表后端返回数据正常，数据成功写入数据库了
                        alert("编辑成功");
                        window.close();
                        return;
                    }
                    alert(data);
                },
                //失败回调
                error: function (data) {
                    alert("接口异常，请稍后再试~");
                }
            });
            return false;
        });
    })
</script>
</body>
</html>